<template>
    <view class="content page" id="checkout_counter" :style="{ '--color': color }">
        <status-bar title="支付" :delta="detal"></status-bar>
        <view class="c_ctr_main">
            <view class="c_ctr_info thmeBg">
                <view>
                    <view>应付</view>
                    <view class="price6">
                        ￥
                        <span class="price6_num">{{ total.total_fee ? total.total_fee : 0 }}</span>
                    </view>
                </view>
                <image class="img_cover" :src="staticUrl + '/images/checkstand_cover.png'" mode="widthFix"></image>
            </view>

            <PlayMethod :pageData="payMode" :info="total.payText" @PayMethods="pay_money"></PlayMethod>
        </view>
    </view>
</template>
<script>
    var that;
    import PlayMethod from '@/components/PlayMethod.vue';

    export default {
        components: {
            PlayMethod
        },
        data() {
            return {
                color: getApp().globalData.color,
                payFlag: true,
                payAPP: '',
                paytype: '',
                playid: '',
                openId: uni.getStorageSync('openid'),
                total: '',

                mode: uni.getStorageSync('mode'),
                staticUrl: this.staticUrl,
                notEnough: false, // 余额不足
                cashPay: uni.getStorageSync('startUp').cashPay, // 是否开起线下付款 1开起 0不开启
                payState: uni.getStorageSync('startUp').payState, // 是否开起支付功能 1开起 0不开启
                detal: 1,
                car_id: '',
                tid: '',
                union_order_code: '',
                flag: false,
                pageData: '',
                shwoPop: 0,
                payMode: [] // 支付方式
            };
        },
        onShow() {
            that = this;

            if (uni.getStorageSync('path') == '12') {
                // 支付成功返回
                this.backHome();
            }
            that.notEnough = false;

            let options = wx.getEnterOptionsSync();

            if (options.scene == '1038' && options.referrerInfo.appId == 'wxef277996acc166c3' && this.shwoPop == 1) {
                let extraData = options.referrerInfo.extraData;
                if (!extraData) return;
                if (extraData.code == 'success') {
                    that.$rectTo('/pages/index/pay_scs?playid=' + that.playid);
                } else if (extraData.code == 'cancel') {
                    that.$rectTo('/pages/index/orderList?status=0&clickNav=1');
                } else {
                    that.$rectTo('/pages/index/orderList?status=0&clickNav=1');
                }
            }
        },
        onLoad(e) {
            console.log('e', e);
            that = this;
            that.playid = e.payid;
            if (e.car_id) this.car_id = e.car_id;
            if (e.tid) this.tid = e.tid;
            if (e.union_order_code) this.union_order_code = e.union_order_code;
            that.getPageData();
            if (e.path == 1) {
                // 从下单页面来的
                that.detal = 2;
            }
        },
        onUnload() {
            this.shwoPop = 0;
        },
        methods: {
            pay_select: function (item) {
                if (item.money && parseFloat(item.money) < parseFloat(this.total.total_fee)) return;
                this.paytype = item.payType;
                this.payAPP = item.title;
                this.notEnough = false;
                if (item.money && parseFloat(item.money) < parseFloat(this.total.total_fee)) this.notEnough = true;
            },
            getPageData: function () {
                //获取页面初始化数据
                that.$http
                    .post({
                        url: '/accountPay/getOrderInfo3',
                        data: {
                            orderAesStr: that.playid
                        }
                    })
                    .then((res) => {
                        if (res.code != 100) return this.$Toast(res.msg);
                        if (res.code == 100) {
                            const result = res.data;
                            this.total = result;
                            const requestPayMode = result.payMode || [];
                            requestPayMode.forEach((item) => {
                                item.select = 0;
                                if (item.payType == 1) {
                                    item.iconfont = 'icon-weixinzhifu';
                                    item.playName = 'wxPay';
                                }
                                if (item.payType == 2) {
                                    item.iconfont = 'icon-yuezhifu';
                                    item.playName = 'balancePay';
                                }
                                if (item.payType == 98) {
                                    item.iconfont = 'icon-chuxuqiazhifu';
                                    item.playName = 't_walletPay';
                                }
                            });
                            this.payMode = requestPayMode;
                            // if (this.payMode.length) this.paytype = this.payMode[0].payType;

                            // if (that.payMode.length) {
                            // 	let first = that.payMode.find(item => !item.money || parseFloat(item.money) >=
                            // 		parseFloat(that.total.total_fee))
                            // 	if (!first) return
                            // 	that.paytype = first.payType
                            // 	that.payAPP = first.title
                            // }
                        }
                    });
            },
            pay_money: function (e) {
                if (e) this.payMode = e;
                console.log(e, 'e');

                if (this.notEnough) return; // 余额不足

                if (!this.payFlag) return; // 避免重复提交

                uni.showLoading({
                    title: '支付中···'
                });
                let requestData = {
                    payType: 0
                };
                const selectedMethods = this.payMode.filter((item) => item.select == 1);
                if (selectedMethods.length == 1) requestData.payType = selectedMethods[0].payType;
                this.payMode.forEach((n) => {
                    if (n.wxPay) requestData['wxPay'] = n.wxPay;
                    if (n.balancePay) requestData['balancePay'] = n.balancePay;
                    if (n.t_walletPay) requestData['t_walletPay'] = n.t_walletPay;
                });
                // console.log(requestData, 'requestData');
                // return;
                that.$http
                    .post({
                        url: '/accountPay/cashierStorePageAjax',
                        data: {
                            orderAesStr: that.playid,
                            openId: that.openId,
                            ...requestData
                        }
                    })
                    .then((res) => {
                        uni.hideLoading();
                        if (res.code == 100) {
                            that.flag = true;
                            var data = res.data;
                            const Result = res.data;
                            this.pageData = Result;

                            // 微信支付
                            // #ifdef MP-WEIXIN
                            if (Result.extraData) {
                                this.shwoPop = 1;
                                wx.openEmbeddedMiniProgram({
                                    appId: Result.appId,
                                    extraData: Result.extraData
                                });
                            } else {
                                uni.getProvider({
                                    service: 'oauth',
                                    success: function (resp) {
                                        console.log(resp.provider);
                                        if (resp.provider) {
                                            uni.requestPayment({
                                                provider: resp.provider[0],
                                                orderInfo: data,
                                                timeStamp: data.timeStamp,
                                                nonceStr: data.nonceStr,
                                                package: data.package,
                                                signType: data.signType,
                                                paySign: data.paySign,
                                                success: function (resj) {
                                                    console.log('success:' + JSON.stringify(resj));
                                                    that.$rectTo('/pages/index/pay_scs?playid=' + that.playid);
                                                },
                                                fail: function (err) {
                                                    console.log('fail:' + JSON.stringify(err));
                                                    that.$rectTo('/pages/index/orderList?status=0&clickNav=1');
                                                }
                                            });
                                        }
                                    }
                                });
                            }

                            // if (that.paytype == 1) {

                            //     // #endif
                            // } else {
                            //     uni.redirectTo({
                            //         url: '/pages/index/pay_scs?playid=' + that.playid
                            //     });
                            // }
                        } else {
                            if (that.paytype == 99) {
                                // 货到付款不成功
                                uni.navigateTo({
                                    url: '/pages/index/orderList?status=0&clickNav=1'
                                });
                                return;
                            }
                            uni.showToast({
                                icon: 'none',
                                title: res.msg,
                                duration: 2000
                            });
                        }
                    });
            }
        },
        onUnload() {
            console.log('flag', this.flag);
            if (this.tid && !this.flag) {
                this.$http
                    .post({
                        url: '/singleSaleApi/tableConfirmOrder',
                        data: {
                            union_order_code: this.union_order_code,
                            car_id: this.car_id,
                            tid: this.tid
                        }
                    })
                    .then((res) => {
                        console.log(res);
                    });
            }
        }
    };
</script>

<style lang="scss" scoped>
    radio {
        transform: scale(0.7);
    }

    .wx_pay {
        width: 54upx;
        height: 54upx;
    }

    .price6_num {
        font-size: 60upx;
    }

    #checkout_counter .c_ctr_main {
        background: #ffffff;
    }

    .c_ctr_main .c_ctr_info {
        height: 360upx;
        margin-bottom: 24upx;
        display: flex;
        display: -webkit-flex;
        justify-content: center;
        align-items: center;
        text-align: center;
        color: #ffffff;
        position: relative;
    }

    .img_cover {
        height: 38upx;
        width: 100%;
        position: absolute;
        left: 0;
        right: 0;
        bottom: 0;
    }

    .c_ctr_info .price6 {
        margin-top: 20upx;
    }

    .c_ctr_main .c_ctr_list {
        padding: 0 30upx;
    }

    .c_ctr_list .c_ctr_item {
        height: 112upx;
        border-bottom: 1px solid #dddddd;
        display: flex;
        display: -webkit-flex;
        justify-content: space-between;
        align-items: center;
    }

    .c_ctr_item .c_ctr_item_info {
        display: flex;
        display: -webkit-flex;
        align-items: center;
    }

    .c_ctr_item_info .c_ctr_item_ico {
        width: 56upx;
        height: 56upx;
        display: flex;
        display: -webkit-flex;
        justify-content: center;
        align-items: center;
    }

    .c_ctr_item_info .c_ctr_item_t {
        width: 560upx;
        margin-left: 20upx;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        font-size: 28upx;
        font-family: arial;
    }

    .c_ctr_pay {
        position: fixed;
        right: 0;
        bottom: 30upx;
        left: 0;
        z-index: 999;
        margin-bottom: constant(safe-area-inset-bottom);
        margin-bottom: env(safe-area-inset-bottom);
    }

    .fake-radio.disabled {
        background: #ebedf0;

        .icon-xuanzhong {
            color: #ebedf0;
        }
    }
</style>
